<template>
	<view class="page">

		<view class="item" v-show="type == '机构'">
			<text class="title">机构名称</text>
			<view class="content">
				<input type="text" v-model="form.institution" value="请输入机构的名称" placeholder="请输入机构的名称" />
			</view>
		</view>
		<view class="item">
			<text class="title" v-show="type!='机构'">姓名</text>
			<text class="title" v-show="type=='机构'">机构管理员姓名</text>
			<view class="content">
				<input type="text" v-model="form.name" value="请输入您的姓名" placeholder="请输入您的姓名" />
			</view>
		</view>
		<view class="item">
			<text class="title">性别</text>
			<view class="content">
				<picker mode="selector" :value="form.gender" :range="genderOption" :range-key="'text'"
					@change="bindGenderChange">
					<view class="picker">{{genderOption[index].text ?genderOption[index].text:'请选择您的性别'}}</view>
				</picker>
			</view>
		</view>
		<view class="item">
			<text class="title">出生年月</text>
			<view class="content">
				<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
					<view>{{date}}</view>
				</picker>
			</view>
		</view>
		<view class="item">
			<text class="title">手机号</text>
			<view class="content">
				<input type="number" v-model="form.phone" placeholder="请输入您的手机号" maxlength="11" />
			</view>
		</view>
		<view class="item" v-show="type!='机构'">
			<text class="title">所属机构</text>
			<view style="
		display: flex;">
				<view class="institution" @click="jumpToInstitution()">
					{{form.institution?form.institution:'点击以搜索机构'}}
				</view>
				<view class="noneInstitution" @click="bindInstitutionChange()">
					无
				</view>
			</view>

		</view>
		<view class="item">
			<text class="title">个人简介</text>
			<view class="content">
				<input type="text" v-model="form.introduction" placeholder="请输入您的个人简介" />
			</view>
		</view>
		<view class="item" v-show="type == '机构'">
			<text class="title" >机构简介</text>
			<view class="content">
				<input type="text" v-model="form.insIntroduction" placeholder="请输入您的机构简介" />
			</view>
		</view>

		<view class="item" v-show="type == '机构'">
			<text class="title">机构地址</text>
			<view class="content">
				<input type="text" v-model="form.address" placeholder="请输入机构的地址" @click="chooselocation()" />
			</view>
		</view>
		<view>

			<button class="sbutton" type="default" hover-class="button-hover" @click="submit()">保存</button>
		</view>
	</view>
</template>

<script>
	import cloudbase from '@cloudbase/js-sdk';
	const db = cloudbase.database();
	export default {
		data() {
			const currentDate = this.getDate({
				format: true
			})
			return {
				index: 0,
				type: '',
				genderOption: [{
						value: 0,
						text: '男'
					},
					{
						value: 1,
						text: '女'
					}
				],
				date: currentDate,
				form: {
					name: '', //姓名
					gender: getApp().globalData.userInfo.gender, //性别
					birthday: currentDate, //生日，出生年月
					phone: '', //手机号
					institution: '', //机构
					institutionId: '', //机构
					introduction: '', //个人简介
					insIntroduction: '', //机构简介
					address: '',
					location: {
						latitude: '',
						longitude: ''
					}
				}
			}
		},
		onLoad: function(option) {
			this.type = option.type;
			getApp().globalData.userInfo.type = option.type;
			if(option.type!='学生'){
				getApp().globalData.userInfo.authType = option.type;
			}
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		methods: {
			bindGenderChange: function(e) {
				this.form.gender = e.target.value;
				// this.index = e.target.value;
				// console.log(this.form.gender);
			},

			bindDateChange: function(e) {
				this.date = e.target.value;
				this.form.birthday = this.date;
				// console.log(this.date);
			},

			getDate: function(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();

				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			jumpToInstitution: function() {
				uni.navigateTo({
					url: "../institution/institution?type=register"
				})
			},
			bindInstitutionChange: function() {
				this.form.institution = '无';
			},
			chooselocation: function() {
				let that = this;
				uni.chooseLocation({
					success(res) {
						// console.log(res);
						that.form.location.latitude = res.latitude;
						that.form.location.longitude = res.longitude;
						that.form.address = res.address;
					}
				})
			},
			// 提交按钮
			submit: function() {
				if (this.type === '机构') {
					// console.log(this.form);
					if (this.form.institution === '' || this.form.name === '' || this.form.gender === '' || this.form
						.birthday === '' || this.form.phone === '' || this.form.introduction === '' || this.form
						.location === ''||this.form.insIntroduction =='') {

						uni.showToast({
							title: '信息不足,请填写全部信息',
							icon: 'none'
						})
					} else {

						getApp().globalData.userInfo.institution = this.form.institution;
						getApp().globalData.userInfo.introduction = this.form.introduction;
						getApp().globalData.userInfo.insIntroduction = this.form.insIntroduction;
						getApp().globalData.userInfo.birthday = this.form.birthday;
						getApp().globalData.userInfo.gender = this.form.gender;
						getApp().globalData.userInfo.phone = this.form.phone;
						getApp().globalData.userInfo.address = this.form.address;
						getApp().globalData.userInfo.location = new db.Geo.Point(this.form.location.longitude, this.form.location.latitude);
						getApp().globalData.userInfo.realName = this.form.name;

						this.insRegister();
					}
				} else {
					console.log(this.form);
					if (this.form.name === '' || this.form.gender === '' || this.form.birthday === '' || this.form
						.phone === '' || this.form.institution === '' || this.form.introduction === '') {

						uni.showToast({
							title: '信息不足,请填写全部信息',
							icon: 'none'
						})
					} else {
						getApp().globalData.userInfo.realName = this.form.name;
						getApp().globalData.userInfo.gender = this.form.gender;
						getApp().globalData.userInfo.birthday = this.form.birthday;
						getApp().globalData.userInfo.phone = this.form.phone;
						getApp().globalData.userInfo.institution = this.form.institution;
						getApp().globalData.userInfo.introduction = this.form.introduction;
						this.register();
						// uni.switchTab({
						// 	url: "/pages/mine/mine"
						// });
					}
				}
			},
			// let admin = event.admin;
			//     let name = event.name;
			//     let avatarUrl = event.avatarUrl;
			//     let introduction = event.introduction;
			//     let imageUrl = [];
			//     let phone = event.phone;
			//     let address = event.address;
			//     let location = event.location;
			//     let staff = event.staff;
			//     let student = event.student;
			//     let teacher = event.teacher;
			//     let course = event.course;
			//     let attendance = event.attendance;
			//     let isIn = event.isIn;
			// 云函数-注册
			register: function() {
				cloudbase.database().collection('user').add({
					openId: getApp().globalData.userInfo.openId,
					nickName: getApp().globalData.userInfo.nickName,
					realName: getApp().globalData.userInfo.realName,
					avatarUrl: getApp().globalData.userInfo.avatarUrl,
					birthday: getApp().globalData.userInfo.birthday,
					country: getApp().globalData.userInfo.country,
					type: getApp().globalData.userInfo.type,
					phone:getApp().globalData.userInfo.phone,
					gender: getApp().globalData.userInfo.gender,
					province: getApp().globalData.userInfo.province,
					city: getApp().globalData.userInfo.city,
					introduction: getApp().globalData.userInfo.introduction,
					power:getApp().globalData.userInfo.power,
					auth: getApp().globalData.userInfo.auth,
					authType:getApp().globalData.userInfo.authType,
					authContent:getApp().globalData.userInfo.authContent,
					school:getApp().globalData.userInfo.school,
					institution: getApp().globalData.userInfo.institution,
					institutionId: getApp().globalData.userInfo.institutionId,
					referrer:getApp().globalData.userInfo.referrer,
					orderList:getApp().globalData.userInfo.orderList,
					classList:getApp().globalData.userInfo.classList,
					messageList:getApp().globalData.userInfo.messageList,
					credits:getApp().globalData.userInfo.credits,
					ticketList:getApp().globalData.userInfo.ticketList,
					isIn: getApp().globalData.userInfo.isIn,
					isRegister:true
				}).then(res=>{
					// console.log(res);
					if (res.id) {
						uni.showToast({
							title: '注册成功,请重新登录',
							icon: 'none',
							duration: 1500
						});
						setTimeout(()=>{
							uni.navigateTo({
								url: "../login/login?from=register"
							});
						}, 1500)
						// if(getApp().globalData.userInfo.type!='机构'){
							
						// 	uni.switchTab({
						// 		url: "/pages/mine/mine"
						// 	});
						// }
					} else {
						uni.showToast({
							title: '注册失败',
							icon: 'none',
							duration: 1000
						})
					}
				})
			},

			// 云函数-机构注册
			insRegister: function() {
				cloudbase.database().collection('institution').add({
					admin: getApp().globalData.userInfo.openId,
					name: getApp().globalData.userInfo.institution,
					avatarUrl: getApp().globalData.userInfo.avatarUrl,
					insIntroduction: getApp().globalData.userInfo.insIntroduction,
					phone: getApp().globalData.userInfo.phone,
					type: getApp().globalData.userInfo.type,
					auth: getApp().globalData.userInfo.auth,
					authType:getApp().globalData.userInfo.authType,
					institution: getApp().globalData.userInfo.institution,
					address: getApp().globalData.userInfo.address,
					location: getApp().globalData.userInfo.location ,
					isIn: getApp().globalData.userInfo.isIn,
					staff: [],
					student: [],
					teacher: [],
					course: [],
					attendance: [],
					imageUrl: [],
					fileList:[]
				}).then(res => {

					// console.log(res)
					getApp().globalData.userInfo.institutionId = res.id;
					
					this.register();

				})
			}

		}
	}
</script>

<style>
	.page {
		width: 750rpx;
		height: 1435rpx;
		background-color: #F3F5F7;
		/* background-color: #0000FF; */
		padding-top: 20rpx;
		/* padding-left: 64rpx;
		padding-right: 64rpx; */
		display: flex;
		flex-direction: column;
	}

	.item {
		width: 622rpx;
		height: 133rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20rpx;

	}

	.title {
		font-size: 26rpx;
		color: #666666;
		margin-bottom: 15rpx;

		/* margin-left: 64rpx; */
		/* margin-right: 64rpx; */

	}

	.content {
		width: 622rpx;
		height: 92rpx;
		background-color: #FFFFFF;
		box-shadow: 0px 4px 6px rgba(0, 0, 0, .05);
		border-radius: 16rpx;
		/* margin-left: 64rpx; */
		/* margin-right: 64rpx; */
		line-height: 92rpx;
		font-size: 14px;
		padding-left: 14px;
		color: #A2A2A2;
	}

	.content input {
		height: 92rpx;
		line-height: 92rpx;

		color: #A2A2A2;
	}

	.institution {
		width: 300rpx;
		height: 92rpx;
		background-color: #FFFFFF;
		box-shadow: 0px 4px 6px rgba(0, 0, 0, .05);
		border-radius: 16rpx;
		line-height: 92rpx;
		font-size: 14px;
		padding-left: 14px;
		color: #A2A2A2;
	}

	.noneInstitution {
		/* float: left; */
		width: 300rpx;
		height: 92rpx;
		background-color: #FFFFFF;
		box-shadow: 0px 4px 6px rgba(0, 0, 0, .05);
		border-radius: 16rpx;
		line-height: 92rpx;
		font-size: 14px;
		margin-left: 22rpx;
		padding-left: 14px;
		color: #A2A2A2;
	}

	.sbutton {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		width: 200rpx;
		height: 96rpx;
		background-color: #FD973F !important;
		border-radius: 20px;
		color: #FFFFFF !important;
		margin-top: 68rpx;
	}

	.button-hover {
		background-color: rgba(0, 0, 0, 0.1) !important;
		opacity: 0.7;
	}
</style>
